import React from 'react'
import {Link} from 'react-router'


import '../public/css/contractlist.scss'
import Api from "../router/Api";
import requestSign from "../public/js/requestSign";


class ContractList extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            contractLists:[],
            id:this.props.id
        }
    }
    handleClose(){
        this.props.isContractShow("false")
    }
    componentWillMount(){
        const _this = this;
        Api.getTimeStamp()
            .then(function (res) {
                const token = sessionStorage.getItem('token');
                const timestamp = res.data.data.timestamp;
                const id = _this.state.id;
                const sign = requestSign({timestamp,token,id});
                Api.getContractList({
                    params:{
                        token:token,
                        timestamp:timestamp,
                        sign:sign.sign,
                        id:id
                    }
                })
                    .then(function (res) {
                        console.log(res);
                        if(res.data.success){
                            _this.setState({
                                contractLists:res.data.data.rows
                            })
                        }
                    })
            })
            .catch(function (err) {
                console.log(err)
            })

    }
    render(){
        const contractlists = this.state.contractLists.map((list,i)=>
            <li key={i} className="clearFix"><Link to={"/contract/"+list.id}><span>{list.realName}</span><span>{list.mobile}</span><span className="icon iconfont icon-icon-right fr"></span></Link></li>
        )
        return(
            <div className={(this.props.dialog === 'true') ? "dialog" : "hide"}>
                <div className="mask"></div>
                <div className="listctn">
                    <div><p>借款合同</p></div>
                    <div className="list">
                        <ul>{contractlists}</ul>
                    </div>
                    <i className="icon iconfont icon-guanbi" onClick={this.handleClose.bind(this)}></i>
                </div>

            </div>
        )
    }
}

export default ContractList